Exploring x-height & the em square字型高度和字元空間

換字型或新增新字型時，頁面排版可能會出現小變化。雖然這些變化不太明顯，但會影響設計效果。下面我們就來解釋這是為什麼。

製作字型時，設計師會把每個字母放在一個稱為"字元空間"的框子裡，並按照固定的垂直標準來設計。拿英文字母來說，從上到下分別有這些部分：字母最高點、大寫字母高度、小寫字母高度（也叫x-height）、基準線，以及字母最低點。

x-height（小寫字母高度）是字型中小寫字母的相對高度，理解這一概念有助於字型搭配。

x-height（小寫字母高度）會影響我們閱讀文字的舒適程度。規律很簡單：x-height越大，小字型的文字就越容易看清楚。

為什麼叫x-height？因為小寫字母x上下兩邊平整，代表了小寫字母的標準高度。增加x-height會讓字母內部空間變大，這時通常需要相應增加行距。

不同字型的小寫字母高度（x-height）各不相同。就算把兩種字型都設定成一樣的大小（比如12號），它們看起來的實際大小也會不一樣 - 有的看著大一些，有的看著小一些。這個差異在大字的標題裡不太容易看出來，但在小字的正文裡就很明顯。因此，當我們更換字型時，可能會發現文字在頁面上的位置有輕微的變化。

換字型時會遇到一個常見問題：就算字號保持不變，字型的位置可能也會變化。這會影響設計效果，尤其是在以下情況：更新品牌設計時、設計網站或APP按鈕時、調整整體設計佈局時
所以在用不同字型代替原來的字型（特別是代替粗體）時，要特別注意這一點。

為什麼會這樣呢？每個字母都放在一個透明的"畫框"裡，這個畫框就叫"字元空間"。這個畫框最早是根據大寫字母"M"的大小來設計的。畫框有上下兩條界限，就像天花板和地板一樣。設計師把這個空間分成1000份，其中上面用800份，下面用200份。

這個字元空間就像一個盒子，特別是在等寬字型中每個字母都要嚴格待在盒子裡。不過，有些字母上的裝飾部分（比如花體字的裝飾筆畫）可能會稍微超出這個盒子的範圍。

當我們設定字號（比如14px）時，其實是在設定字元空間的大小。雖然我們在軟體裡定好了字號，但字型設計師可以按自己的想法，把字母放在這個空間裡的任何位置。這就好像給畫家一個畫框，他可以在框裡隨意畫畫一樣。因此每個字型的位置都可能不一樣。

每種字型都有各自特點，有些字母寫得更飽滿。如果小寫字母較大，大寫字母和延伸部分就會相對小些，整體顯得更大。即使兩種字型x-height相近，由於在字元空間中的位置不同，字母高度也可能有差異。

字型在字元空間的位置可能差異很大。設計師需要了解不同字型的特點，以便更好地搭配和調整。雖然有各種參考指標，但最終還是要靠眼光來選擇最合適的方案。